chore: migrate postprocessing docs to Nuxt + Nuxt UI by alvarosabu · Pull Request #1406 · Tresjs/tres

alvarosabu · 2026-04-22T17:07:11Z

Summary

Migrate apps/postprocessing-docs-vitepress to a new Nuxt v4 + Nuxt UI v4 docs app at apps/postprocessing-docs, mirroring the cientos-docs architecture with a dedicated pink/magenta theme sourced from the playground's tres-postprocessing color (#FF7BAC).

Closes TRES-272

What's in

New app scaffold duplicated from apps/docs-boilerplate and rebranded (@tresjs/post-processing workspace dep, pink primary palette anchored at -300, postprocessing GitHub/footer/TOC links, LLM sections for Getting Started / API / Advanced)
34 demo components ported from VitePress → Nuxt with the cientos MDC pattern:
- 29 pmndrs effects under app/components/pmndrs/ (Ascii, Bloom, Chromatic Aberration, Depth of Field, God Rays, Glitch, Kuwahara, Outline, Pixelation, Vignette, Shock Wave, etc.)
- 5 three native effect demos under app/components/three/ (Glitch, Halftone, Pixelation, Smaa, UnrealBloom)
- Shared DocsDemo.vue wrapper (ClientOnly + Suspense + optional Leches panel via `controls` prop)
38 markdown pages with Nuxt Content MDC syntax:
- Landing hero + getting-started (introduction + installation) + API overview + advanced guide
- 29 pmndrs effect pages + 6 three native effect pages + `output.md` (doc-only)
Canonical Leches binding fix: destructured `useControls` refs bound per-prop instead of broken `v-bind="reactiveObject"` pattern (caught in code review before replicating 27×)
Deploy config (`netlify.toml`)

What's out of scope (follow-up)

Deleting `apps/postprocessing-docs-vitepress` (after production flip)
Updating links in `apps/docs` to point at the new site (after DNS flip)
Pink `-400` → `-900` visual QA (shades are educated-guesses anchored at `#FF7BAC = -300`; tune via uicolors.app if needed)
Some source features dropped due to missing deps: gsap animations on FishEye/ColorAverage/ColorDepth/ShockWave replaced with `useLoop`/static; FXAA split-screen simplified to single canvas

Test plan

`pnpm --filter postprocessing-docs lint` — clean ✅
`pnpm --filter postprocessing-docs typecheck` — only pre-existing `ProseA.vue:29` boilerplate error ✅
`pnpm --filter postprocessing-docs build` — all 37 pages prerender, `llms.txt` + `llms-full.txt` generate ✅
`pnpm --filter postprocessing-docs dev` — landing renders with pink hero, sidebar lists all effects, each demo page renders 3D scene + Leches controls (where applicable)
Navigate `/api/pmndrs/bloom` — hotpink emissive sphere renders with visible bloom glow + 4 sliders that actually affect the scene (intensity, radius, luminanceThreshold, luminanceSmoothing)
Navigate `/api/three/unreal-bloom` — demo renders with Leches panel
Navigate `/advanced/you-might-not-need-post-processing` — renders
Dark-mode toggle works across pages

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Migrates final 7 effects: Sepia, ShockWave, SMAA, Texture, TiltShift, ToneMapping, Vignette. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

…ide Leches for static demos

netlify · 2026-04-22T17:07:17Z

✅ Deploy Preview for cientos-tresjs ready!

Name	Link
🔨 Latest commit	`f095694`
🔍 Latest deploy log	https://app.netlify.com/projects/cientos-tresjs/deploys/6a1d2e8309beab0008606da1
😎 Deploy Preview	https://deploy-preview-1406--cientos-tresjs.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

netlify · 2026-04-22T17:07:17Z

✅ Deploy Preview for tresjs-docs ready!

Name	Link
🔨 Latest commit	`f095694`
🔍 Latest deploy log	https://app.netlify.com/projects/tresjs-docs/deploys/6a1d2e830cc9460008efe525
😎 Deploy Preview	https://deploy-preview-1406--tresjs-docs.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

netlify · 2026-04-22T17:07:18Z

✅ Deploy Preview for tresjs-lab ready!

Name	Link
🔨 Latest commit	`f095694`
🔍 Latest deploy log	https://app.netlify.com/projects/tresjs-lab/deploys/6a1d2e832fbc61000851a5bc
😎 Deploy Preview	https://deploy-preview-1406--tresjs-lab.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

…o-nuxt-nuxt-ui

pkg-pr-new · 2026-04-28T19:42:09Z

Open in StackBlitz

@tresjs/cientos

npm i https://pkg.pr.new/@tresjs/cientos@1406

@tresjs/core

npm i https://pkg.pr.new/@tresjs/core@1406

@tresjs/eslint-config

npm i https://pkg.pr.new/@tresjs/eslint-config@1406

@tresjs/leches

npm i https://pkg.pr.new/@tresjs/leches@1406

@tresjs/nuxt

npm i https://pkg.pr.new/@tresjs/nuxt@1406

@tresjs/post-processing

npm i https://pkg.pr.new/@tresjs/post-processing@1406

commit: c542f5f

…o-nuxt-nuxt-ui

…ing to other pages

…o-nuxt-nuxt-ui

…t-processing docs

Tinoooo · 2026-05-24T19:36:08Z

issue: Navigating away from this page makes the browser tab freeze. Also happens on other pages though.

Tinoooo · 2026-05-24T19:50:46Z

issue: typecheck fails.

…ser components memory leaks fix, typescript and hydration issues

netlify · 2026-05-25T12:42:29Z

✅ Deploy Preview for postprocessing-tresjs ready!

Name	Link
🔨 Latest commit	`f095694`
🔍 Latest deploy log	https://app.netlify.com/projects/postprocessing-tresjs/deploys/6a1d2e830244730007c83afd
😎 Deploy Preview	https://deploy-preview-1406--postprocessing-tresjs.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
🤖 Make changes	Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

…o-nuxt-nuxt-ui

alvarosabu · 2026-05-25T13:59:19Z

Hey @Tinoooo I commit some changes, I think they tackle all your points

…o-nuxt-nuxt-ui

Tinoooo

Two very small things left. Rest is fine. Thank you for the migration!

Co-authored-by: Tino Koch <17991193+Tinoooo@users.noreply.github.com>

…o-nuxt-nuxt-ui

alvarosabu and others added 20 commits April 22, 2026 10:05

chore(postprocessing-docs): scaffold app from docs-boilerplate

3fcf86c

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

chore(postprocessing-docs): apply pink theme and rebrand app config

eb19985

chore(postprocessing-docs): configure nuxt-llms sections and pkg version

cfe1e89

chore(postprocessing-docs): copy brand assets from vitepress source

309dc99

feat(postprocessing-docs): add DocsDemo MDC wrapper with Leches panel

07d3130

feat(postprocessing-docs): add landing page hero and features

30e0f06

feat(postprocessing-docs): migrate getting-started content

b63f128

feat(postprocessing-docs): scaffold api and advanced sections

1b63b97

feat(postprocessing-docs): migrate Bloom demo and docs (pmndrs pattern)

32cc6a6

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

fix(postprocessing-docs): bind Leches controls to Bloom props

cfa2454

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

feat(postprocessing-docs): migrate pmndrs effects batch 1/4

af0eaa6

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

feat(postprocessing-docs): migrate pmndrs effects batch 2/4

f753e1e

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

feat(postprocessing-docs): migrate pmndrs effects batch 3/4

4f9782c

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

feat(postprocessing-docs): migrate pmndrs effects batch 4/4

a08fda6

Migrates final 7 effects: Sepia, ShockWave, SMAA, Texture, TiltShift, ToneMapping, Vignette. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

feat(postprocessing-docs): migrate three native effects

edd2272

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

feat(postprocessing-docs): port advanced 'you might not need' guide

08ce89c

feat(postprocessing-docs): add header navigation

a1d3433

docs(postprocessing-docs): update CLAUDE.md and README

4c92f0b

chore(postprocessing-docs): apply lint autofixes and typecheck fixes

81078c7

fix(postprocessing-docs): simplify Vignette GLTF, add netlify.toml, h…

a92a964

…ide Leches for static demos

Merge branch 'main' into chore/tres-272-migrate-postprocessing-docs-t…

7c88e3d

…o-nuxt-nuxt-ui

alvarosabu added 4 commits May 7, 2026 20:44

Merge branch 'main' into chore/tres-272-migrate-postprocessing-docs-t…

69d45fb

…o-nuxt-nuxt-ui

docs(ascii): fixed memory leak with suspense and unmount when navigat…

fc47e60

…ing to other pages

Merge branch 'main' into chore/tres-272-migrate-postprocessing-docs-t…

20f1435

…o-nuxt-nuxt-ui

refactor(logo): streamline logo component and update logo SVG for pos…

51e577c

…t-processing docs

alvarosabu requested a review from Tinoooo May 19, 2026 09:42

alvarosabu requested a review from damienmontastier May 19, 2026 09:42

Tinoooo requested changes May 24, 2026

View reviewed changes

chore(postprocessing-docs): remove Suspense wrappers from EffectCompo…

a108d6c

…ser components memory leaks fix, typescript and hydration issues

alvarosabu requested a review from Tinoooo May 25, 2026 12:51

Merge branch 'main' into chore/tres-272-migrate-postprocessing-docs-t…

a6d34a6

…o-nuxt-nuxt-ui

alvarosabu added 3 commits May 28, 2026 06:44

Merge branch 'main' into chore/tres-272-migrate-postprocessing-docs-t…

f95c4f4

…o-nuxt-nuxt-ui

Merge branch 'main' into chore/tres-272-migrate-postprocessing-docs-t…

9a83359

…o-nuxt-nuxt-ui

Merge branch 'main' into chore/tres-272-migrate-postprocessing-docs-t…

c542f5f

…o-nuxt-nuxt-ui

Tinoooo requested changes May 29, 2026

View reviewed changes

Comment thread apps/postprocessing-docs/app/composables/useNavigation.ts

Comment thread apps/postprocessing-docs/app/app.config.ts Outdated

Comment thread apps/postprocessing-docs/app/app.vue

Comment thread apps/postprocessing-docs/app/app.vue

chore: Update apps/postprocessing-docs/app/app.config.ts

7f48ccb

Co-authored-by: Tino Koch <17991193+Tinoooo@users.noreply.github.com>

alvarosabu requested a review from Tinoooo June 1, 2026 07:02

Merge branch 'main' into chore/tres-272-migrate-postprocessing-docs-t…

f095694

…o-nuxt-nuxt-ui

Tinoooo approved these changes Jun 1, 2026

View reviewed changes

alvarosabu merged commit 1f66c23 into main Jun 1, 2026
7 of 8 checks passed

alvarosabu deleted the chore/tres-272-migrate-postprocessing-docs-to-nuxt-nuxt-ui branch June 1, 2026 08:00

alvarosabu mentioned this pull request Jun 1, 2026

docs(postprocessing): migrate new three effects to Nuxt docs + retarget docs-writer agent #1423

Merged

3 tasks

Navigation Menu

Uh oh!

Uh oh!

chore: migrate postprocessing docs to Nuxt + Nuxt UI - #1406

chore: migrate postprocessing docs to Nuxt + Nuxt UI#1406
alvarosabu merged 32 commits into
mainfrom
chore/tres-272-migrate-postprocessing-docs-to-nuxt-nuxt-ui

alvarosabu commented Apr 22, 2026

Uh oh!

netlify Bot commented Apr 22, 2026 •

edited

Loading

Uh oh!

netlify Bot commented Apr 22, 2026 •

edited

Loading

Uh oh!

netlify Bot commented Apr 22, 2026 •

edited

Loading

Uh oh!

pkg-pr-new Bot commented Apr 28, 2026 •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

Tinoooo May 24, 2026

Uh oh!

Tinoooo May 24, 2026

Uh oh!

netlify Bot commented May 25, 2026 •

edited

Loading

Uh oh!

alvarosabu commented May 25, 2026

Uh oh!

Tinoooo left a comment •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Uh oh!

Conversation

alvarosabu commented Apr 22, 2026

Summary

What's in

What's out of scope (follow-up)

Test plan

Uh oh!

netlify Bot commented Apr 22, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for cientos-tresjs ready!

Uh oh!

netlify Bot commented Apr 22, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for tresjs-docs ready!

Uh oh!

netlify Bot commented Apr 22, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for tresjs-lab ready!

Uh oh!

pkg-pr-new Bot commented Apr 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Tinoooo May 24, 2026

Choose a reason for hiding this comment

Uh oh!

Tinoooo May 24, 2026

Choose a reason for hiding this comment

Uh oh!

netlify Bot commented May 25, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for postprocessing-tresjs ready!

Uh oh!

alvarosabu commented May 25, 2026

Uh oh!

Tinoooo left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

netlify Bot commented Apr 22, 2026 •

edited

Loading

netlify Bot commented Apr 22, 2026 •

edited

Loading

netlify Bot commented Apr 22, 2026 •

edited

Loading

pkg-pr-new Bot commented Apr 28, 2026 •

edited

Loading

netlify Bot commented May 25, 2026 •

edited

Loading

Tinoooo left a comment •

edited

Loading